<template>
  <div class="home">
    <div class="xitongtop"><img src="@/assets/shape_u112.png" />系统设置</div>
    <ul class="zongjian">
      <li>账号与安全 <img src="@/assets/形状结合_u5004.png" /></li>
      <li>隐私设置 <img src="@/assets/形状结合_u5004.png" /></li>
      <li>阅读设置 <img src="@/assets/形状结合_u5004.png" /></li>
      <li>通知设置 <img src="@/assets/形状结合_u5004.png" /></li>
      <li>清除缓存 <span>290kb</span></li>
      <li>关于我们 <img src="@/assets/形状结合_u5004.png" /></li>
    </ul>
    <button>退出登录</button>
  </div>
</template>

<script>
export default {
   data() {
      return {
      }
   },
   created(){
   },
   computed:{
   },
   methods:{
   },
}
</script>
<style lang="less" scoped>
template {
  background-color: rgb(221, 224, 227);
}
.home {
  width: 100%;
  height: 100%;

  .xitongtop {
    width: 100%;
    height: 5rem;
    font-size: 2.5rem;
    font-weight: bold;
    background-color: #fff;
    padding-top: 1rem;
    img {
      width: 1.4rem;
      height: 1.7rem;
      margin-right: 12rem;
      margin-left: 2rem;
    }
  }
  .zongjian {
    width: 100%;
    margin-top: 1rem;
    li {
      height: 3.5rem;
      padding-left: 0.6rem;
      border-bottom: 0.5px solid rgb(225, 223, 223);
      font-size: 2rem;
      background-color: #fff;
    }
    img {
     margin-left:25rem ;
    }
    span {
      margin-left: 20rem;
      font-size: 2rem;
      color: rgb(151, 151, 151);
    }
  }
  button {
    width: 35rem;
    height: 5rem;
    margin-top :4rem ;
    margin-left: 1rem;
    font-size: 2.5rem;
    color: rgb(244, 5, 5);
    background-color: #fff;
  }
}
</style>